﻿@model BMS.ViewModels.QuotationModelConfig
@using System.Globalization

@{
    ViewBag.Title = "Quotation Detail";
}

@using (Html.BeginForm("Switch", "Quotation", FormMethod.Post))
{
    @Html.ValidationSummary(true)

    <table align="center">
        <tr>
            <td width="150" align="left">SO No. : @Html.DisplayFor(m => m.orderModel.ServiceOrderNo)</td>
            <td align="left"></td>
            <td width="150" align="right">PO No. :</td>
            <td align="right">@Html.DisplayFor(m => m.QuotModel.PONo)</td>
        </tr>
        <tr>
            <td width="150" align="left">FM : @Html.DisplayFor(m => m.orderModel.FMName)</td>
            <td align="left"></td>
            <td width="150" align="right">Work Order No. :</td>
            <td align="right">@Html.DisplayFor(m => m.orderModel.WorkOrderNo)</td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td width="150" align="right">Quotation No. :</td>
            <td align="right">@Html.DisplayFor(m => m.QuotationNo)</td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td width="150" align="right">Date :</td>
            <td align="right">@Html.DisplayFor(m => m.QuotationCreateDate, "{0:yyyy-MM-dd}")</td>
        </tr>
        <tr>
            <td width="150" align="left">RE : @Html.DisplayFor(m => m.orderModel.Location)</td>
            <td align="left"></td>
            <td width="150" align="right">Vendor No. :</td>
            <td align="right">@Html.DisplayFor(m => m.VendorNo)</td>
        </tr>
        <tr>
            <td width="150" align="left">@Html.DisplayFor(m => m.orderModel.Description)</td>
            <td align="left"></td>
            <td></td>
            <td></td>
        </tr>
    </table>

    <br align="center" />
    <table align="center" border="1" id="itemsTbl">
        <thead>
            <tr>
                <th width="30">Item</th>
                <th width="400">Description</th>
                <th width="80">SOR Item</th>
                <th width="40">Qty</th>
                <th width="40">Unit</th>
                <th width="150">Rate</th>
                <th width="150">Amount (HKD)</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model.QuotItemsList)
            {
                <tr>
                    @if (item.ItemNo != 0)
                    {
                        <td>@item.ItemNo</td>
                    }
                    else
                    {
                        <td></td>
                    }
                    <td align="left">@item.ItemDescription</td>
                    <td>@item.SORItem</td>
                    @if (item.Qty != 0)
                    {
                        <td>@item.Qty</td>
                    }
                    else
                    {
                        <td></td>
                    }
                    <td>@item.Unit</td>
                    @if (item.Rate != 0)
                    {
                        <td>@item.Rate</td>
                    }
                    else
                    {
                        <td></td>
                    }
                    @if (item.ItemAmount != 0)
                    {
                        <td>@item.ItemAmount</td>
                    }
                    else
                    {
                        <td></td>
                    }
                </tr>
            }
        </tbody>
    </table>

    <br align="center" />
    <table align="center">
        <tr>
            <td width="150" align="right">Work Completion</td>
            @if (Model.QuotModel.WorkCompletionDate != DateTime.MinValue)
            {
                <td align="right">@Model.QuotModel.WorkCompletionDate.Value.ToString("dd-MMMM-yyyy", CultureInfo.CreateSpecificCulture("en-US"))</td>
            }
            else
            {
                <td align="right"></td>
            }
            <td width="190" align="right"></td>
            <td width="190" align="right">Total Amount (HKD)</td>
            <td align="right">$@Html.DisplayFor(m => m.QuotModel.TotalAmount)</td>
        </tr>
    </table>

    <br align="center" />
    <div align="center">
        @*<button type="submit" name="Command" value="Save">Save (Excel & PDF)</button>*@
        <button type="submit" name="Command" value="Close">Close</button>
    </div>


}


<link href='~/Scripts/jquery-ui.css' rel='stylesheet'>
<script type="text/javascript" src="~/Scripts/jquery-2.1.0.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui.js"></script>
<script type="text/javascript" src="~/Scripts/knockout-3.0.0.js"></script>
<link href='~/Scripts/jquery-ui-timepicker-addon.css' rel='stylesheet'>
<script type="text/javascript" src="~/Scripts/jquery-ui-timepicker-addon.js"></script>
<script type='text/javascript' src='~/Scripts/jquery-ui-sliderAccess.js'></script>
<script type="text/javascript">
    $(document).ready(function () {
        var counter = 1;

        $("#datepicker").datepicker({
            dateFormat: "dd-MM-yy"
            //addSliderAccess: true,
            //sliderAccessArgs: { touchonly: false }
        });

        $('#AddNewItem').on("click", function () {
            $('<tr><td><input type="text" style="width:30px;" name="ItemNo[' + counter +
                ']"/></td><td><input type="text" style="width:400px;" value="" name="Description[' + counter + ']"' +
                '/></td><td><input type="text" style="width:80px;" value="" name="SORItem[' + counter + ']"' +
                '/></td><td><input type="text" style="width:40px;" value="" name="Qty[' + counter + ']"' +
                '/></td><td><input type="text" style="width:40px;" value="" name="Unit[' + counter + ']"' +
                '/></td><td>$<input type="text" style="width:80px;" value="" name="Rate[' + counter + ']"' +
                '/></td><td>$<input type="text" style="width:80px;" value="" name="Amount[' + counter + ']"' +
                '/></td></tr>').appendTo('#itemsTbl');
            counter++;
            return false;
        });

        $("#itemsTbl").on("change", 'input[name^="Rate"], input[name^="Qty"]', function (event) {
            calculateRow($(this).closest("tr"));
            calculateGrandTotal();
        });
    });

    function calculateRow(row) {
        var price = +row.find('input[name^="Rate"]').val();
        var qty = +row.find('input[name^="Qty"]').val();
        row.find('input[name^="Amount"]').val((price * qty).toFixed(2));
    }

    function calculateGrandTotal() {
        var grandTotal = 0;
        $("#itemsTbl").find('input[name^="Amount"]').each(function () {
            grandTotal += +$(this).val();
        });
        $("#grandtotal").val(grandTotal.toFixed(2));
    }


    function CalculateSubTotal(value) {
        var QtyID = "Qty[" + value + "]";
        var RateID = "Rate[" + value + "]";
        var AmountID = "Amount[" + value + "]";

        var quantity = parseFloat(document.getElementById(QtyID).value);
        var price = parseFloat(document.getElementById(RateID).value);
        var totalPrice = document.getElementById(AmountID);
        totalPrice.value = quantity * price;
    }
</script>